<template>
	<view class="activepages" style="position: relative;">
		<cu-custom :bgColor="'bg-'+theme.backgroundColor" :isBack="true" :isContainer="false">
			<view slot="backText">返回</view>
			<block slot="content">{{pageDivData.pageName}}</block>
		</cu-custom>
		<view class="" v-if="!showDefaultAppPage"
			:style="{backgroundColor:`${pageBackGroundColor}`,backgroundImage:`url(${pageDivData.pageBackPic?pageDivData.pageBackPic : ''})`, 'backgroundSize': '100% 100%' }">
			<!-- 自定义页面组件 -->
			<block v-for="(temp, index) in pageDivData.pageComponent.componentsList" :key="index">
				<!-- 单图 -->
				<template v-if="temp.componentName === 'imageComponent'">
					<view>
						<div-image v-model="temp.data"></div-image>
					</view>
				</template>
				<!-- 双图 -->
				<template v-else-if="temp.componentName === 'multipleImage'">
					<view>
						<div-image-double v-model="temp.data"></div-image-double>
					</view>
				</template>
				<!-- 三图 -->
				<template v-else-if="temp.componentName === 'imageThreeComponent'">
					<view>
						<div-image-three v-model="temp.data"></div-image-three>
					</view>
				</template>
				<!-- 标题文字 -->
				<template v-else-if="temp.componentName === 'titleTextComponent'">
					<view>
						<div-title-text v-model="temp.data"></div-title-text>
					</view>
				</template>
				<!-- 商品 -->
				<template v-else-if="temp.componentName === 'goodsComponent'">
					<view>
						<div-goods v-model="temp.data" :activityId="activityId"></div-goods>
					</view>
				</template>
			</block>
			<!-- <view :class="'cu-load bg-gray ' + (loadmore3?'loading':'over')"></view> -->
		</view>
		<!-- 如果没有自定义页面就用自带页面 -->
		<view v-if="showDefaultAppPage">
			<view style="text-align: center;margin-top: 20rpx;">暂无内容</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	import api from '@/utils/api'

	import divImage from "@/components/div-components-active/div-image/div-image.vue";
	import divImageDouble from "@/components/div-components-active/div-image-double/div-image-double.vue"
	import divImageThree from "@/components/div-components-active/div-image-three/div-image-three.vue";
	import divTitleText from "@/components/div-components-active/div-title-text/div-title-text.vue";
	import divGoods from "@/components/div-components-active/div-goods/div-goods.vue";

	export default {
		components: {
			divImage,
			divImageDouble,
			divImageThree,
			divTitleText,
			divGoods
		},
		data() {
			return {
				theme: app.globalData.theme, //全局颜色变量
				CustomBar: this.CustomBar,
				showDefaultAppPage: false,
				pageDivData: {
					pageComponent: {
						componentsList: []
					}
				}, //首页自定义配置组件的数据		
				loadmore3: true, // 自定义页面的加载状态		
				activityId: '',
				pageBackGroundColor: ''
			};
		},
		props: {},
		onLoad(options) {
			app.initPage().then(res => {
				if (options.activityId) {
					this.activityId = options.activityId
				} else if(options.scene){
					this.activityId = options.scene
				}
				this.loadData(); // 获取活动页面信息
				this.getMainStore(); // 获取总仓				
			})
		},
		onShow() {},
		mounted() {},
		methods: {
			loadData() {
				api.getActiveByid(this.activityId).then(res => {
					if (res.data && res.data.status == '1') {
						this.getPageComponent()
					} else {
						uni.showModal({
							title: '提示', //提示的标题
							content: '活动已结束', //提示的内容
							confirmText: "返回", // 确定按钮的文字，默认为"确定"，最多 4 个字符
							showCancel: false, // 是否显示取消按钮，默认为 true
							success: (res) => {
								if (res.confirm) {
									uni.navigateBack({
										delta: 1
									})
								}
							}
						});
					}
				})
			},
			getPageComponent() {
				this.loadmore3 = true;
				api.getActiveList(this.activityId).then(res => {
					let pageDivData = res.data;
					if (pageDivData) {
						this.pageDivData = pageDivData;
						this.pageBackGroundColor = pageDivData.pageBackPic ? '#FFFFFF' : pageDivData
							.pageBackGroundColor
						if (Object.keys(pageDivData.pageComponent).length === 0) {
							// 如果没有设置自定义页面数据，那就显示默认原始页面
							this.getDefaultPageData();
						} else {
							this.showDefaultAppPage = false;
							this.loadmore3 = false;
						}
					} else {
						// 如果没有设置自定义页面数据，那就显示默认原始页面
						this.getDefaultPageData();
					}
				});
			},
			getDefaultPageData() {
				this.showDefaultAppPage = true;
				this.loadmore3 = false;
			},
			getMainStore() {
				// 获取总仓
				const value1 = uni.getStorageSync('M_mainstore');
				if (!value1) {
					api.getCenterShop('2').then(res => {
						uni.setStorageSync('M_mainstore', res.data);

					})
				}
				const value2 = uni.getStorageSync('Y_mainstore');
				if (!value2) {
					api.getCenterShop('6').then(res1 => {
						uni.setStorageSync('Y_mainstore', res1.data);
					})

				}
			}
		}
	};
</script>
<style scoped>
	@import "./index.css";

	.search_container {
		position: fixed;
		top: 250rpx;
		left: 0rpx;
		right: 0;
		z-index: 1;
	}

	.address_container {
		position: fixed;
		top: 200rpx;
		left: 0;
		right: 0;
		z-index: 1;
		display: flex;
		align-items: center;
		padding-left: 20rpx;
		width: 100%;
		height: 100rpx;
		font-size: 32rpx;
	}

	.add_icon {
		flex: 0 0 40rpx;
	}

	.add_view {
		flex: 1;
	}

	.add_toggle {
		flex: 0 0 100rpx
	}

	.tabbar_blank {
		padding-top: 100rpx
	}

	.activepages ::v-deep.cuIcon-home {
		color: #e5432e;
	}

	.activepages ::v-deep.cuIcon-home::before {
		color: #FFFFFF;
	}

	.share_mp {
		/*position: fixed;
		top: 50%;
		right: 5%; */
		z-index: 999;
		background-color: rgba(165, 42, 42, 0);
		/* padding: 0 10rpx; */
	}
</style>